import React, { Component } from 'react';

import {
  Platform,
  StyleSheet,
  Text,
  View,
  Image,
  ScrollView,
  TouchableOpacity,
  Alert
} from 'react-native';

import styled from 'styled-components';
import { queryByRelease, queryPrisonByCount } from '../../api';
import { getToken } from '../../utils/auth';
import { Actions } from 'react-native-router-flux';

// import Cal from './cal';
import Released from './Released';
import LinearGradient from 'react-native-linear-gradient';
import InputItem from 'antd-mobile-rn/lib/input-item';
import WhiteSpace from 'antd-mobile-rn/lib/white-space';
import moment from 'moment';

export default class sportsRankings extends Component {
  state = {
    worklog_error: false,
    prisonInfo: [],
    workcollect: '',
    actiondate: '',
    prisonCount: '',
    stepData: [],
    isShow: true,
    error: false,
    errorInfo: '',
    imgUrl: require('../../assets/work/sportsRankings/backtrack.png')
  };

  render() {
    return (
      <ScrollView
        style={{
          height: 800,
          backgroundColor: '#fff',
          position: 'relative'
        }}>
        <OnTouchableOpacity onPress={() => Actions.home()}>
          <View>
            <Image
              source={this.state.imgUrl}
              style={{ width: 40, height: 20, margin: 5 }}
            />
          </View>
        </OnTouchableOpacity>
        <MovementTextTitle>罪犯释放</MovementTextTitle>
        <View style={styles.container}>
          {/* <Cal /> */}
          <Released
            // bgColor='#b50' //背景颜色
            // headTextColor='#b30' //头部文字颜色
            // textColor='#f00' //日期文字颜色
            // activeBgColor='#fb0' //选中背景色
            // activeTextColor='#fff' //选中文字颜色
            //borderRadius={0} //圆角
            callback={data => {
              this.state.actiondate = data[0].actiondate;
              this.state.actiondate = this.state.actiondate.replace('年', '-');
              this.state.actiondate = this.state.actiondate.replace('月', '-');
              this.state.actiondate = this.state.actiondate.replace('日', '');
              getToken().then(token => {
                let params = {
                  pprDate: this.state.actiondate
                };
                this.setState({
                  prisonInfo: []
                });
                queryByRelease(token, params)
                  .then(res => {
                    const info = [];
                    res.data.forEach(item => {
                      console.log(item);
                      info.push(...this.state.prisonInfo, item);
                    });
                    this.setState({
                      prisonInfo: info
                    });
                  })
                  .catch(error => {
                    this.setState({
                      error: true,
                      errorInfo: error
                    });
                  });
                queryPrisonByCount(token, params)
                  .then(res => {
                    if (res.code == 0) {
                      this.setState({
                        prisonCount: res.data[0].value
                      });
                    }
                  })
                  .catch(error => {
                    this.setState({
                      error: true,
                      errorInfo: error
                    });
                  });
              });
              console.log(this.state.prisonInfo);
              console.log(this.state.prisonCount);
            }} //回调方法
            presentback={data => {
              console.log(data);
              getToken().then(token => {
                let params = {
                  pprDate: data
                };
                this.setState({
                  prisonInfo: []
                });
                queryByRelease(token, params)
                  .then(res => {
                    const info = [];
                    res.data.forEach(item => {
                      console.log(item);
                      info.push(...this.state.prisonInfo, item);
                    });
                    this.setState({
                      prisonInfo: info
                    });
                  })
                  .catch(error => {
                    this.setState({
                      error: true,
                      errorInfo: error
                    });
                  });
                queryPrisonByCount(token, params)
                  .then(res => {
                    if (res.code == 0) {
                      this.setState({
                        prisonCount: res.data[0].value
                      });
                    }
                  })
                  .catch(error => {
                    this.setState({
                      error: true,
                      errorInfo: error
                    });
                  });
                console.log(this.state.prisonInfo);
                console.log(this.state.prisonCount);
              });
            }}
          />
        </View>
        <View>
          <Text>
            今日释放罪犯<Text>{this.state.prisonCount}</Text>人
          </Text>
          <View>
            {this.state.prisonInfo.map(item => {
              return (
                <View>
                  <View>
                    <Text>{item.name}</Text>
                    <Text>{item.deptName}</Text>
                  </View>
                  <View>
                    <Text>{item.pprPrisonerNo}</Text>
                    <Text>{item.pprDate}</Text>
                  </View>
                </View>
              );
            })}
          </View>
        </View>
        {/* position: 'absolute', */}
      </ScrollView>
    );
  }
}

const MovementTextTitle = styled.Text`
  font-size: 40;
  margin-top: 25;
  margin-left: 10;
  font-weight: 500;
`;
const styles = StyleSheet.create({
  container: {
    height: 600,
    backgroundColor: '#F5FCFF',
    marginTop: 10
  }
});

const OnTouchableOpacity = styled.TouchableOpacity``;
